
<template>
    <div class="main_box_">
        <div class="main_le">
            <div class="main_le_title">
                快速导航
            </div>
            <div class="main_le_list">
                <div class="main_list_item" @click="toUserList">
                    用户列表
                </div>
                <div class="main_list_item" 
                v-for="it in store.state.modelList"
                @click="toModelDetail(it)">
                    {{ it.name }}
                </div>
            </div>
        </div>
        <div class="main_ri">
            <router-view />
        </div>
    </div>
</template>
  
<script setup>
import { onMounted } from 'vue';
import {useRouter} from 'vue-router'
import {getModeDetailReq, getAllModeListReq} from '../api/index'
import store from '../store';

onMounted(() => {
    let {token} = store.state.user;
    getAllModeListReq(token)
    .then((resp)=> {
        if (resp.data.code == 200) {
            store.dispatch("setModelList", resp.data.resp_data)
        }else {
            alert('获取模块列表失败')
        }
    }).catch(err=> {
        console.log(err);
    })
    // getModeListReq(token, user_id)
    // .then(resp => {
    //     if (resp.data.code == 200) {
    //         store.dispatch("setModelList", resp.data.resp_data)
    //     }else {
    //         alert('获取模块列表失败')
    //     }
    // }).catch(err => {
    //     console.log(err);
    // })
})
const router = useRouter()
const toUserList = () => {
    router.push({
        path:'/main/userList'
    })
}
const toModelDetail = (it) => {
    let token = store.state.user.token;
    getModeDetailReq(token, it.id)
    .then(resp => {
        if(resp.data.code == 200) {
            let tobj = resp.data.resp_data;
            store.dispatch('setModelByid', tobj);
            store.dispatch('setCurSelModel', it.id)
            router.push({
                path:'/main/addModle'
            })
        }else {
            alert('网络错误')
        }
    }).catch(err=> {
        console.log(err);
    })
    
}
</script>


<style scoped>
.main_box_ {
    width: 1280px;
    display: flex;
    height: inherit;
    position: relative;
}
.main_le {
width: 16%;
}
.main_ri {
width: 74%;
}
.main_list_item{
    line-height: 40px;
}
</style>
  